<script setup>
import { useI18n } from 'vue-i18n'
import popupMessage from '@/components/popupMessage/popupMessage.vue'
import customUpload from '@/components/customUpload/customUpload.vue'

defineProps({
  btnProps: {
    type: Object,
    default: () => {
      return {}
    }
  },
  btnText: {
    type: String,
    default: ''
  }
})

const { t } = useI18n()
const popupRef = ref(null)
const uploadRef = ref(null)
const openPopup = () => {
  popupRef?.value?.openModal()
}

const confirmHandle = () => {
  uploadRef?.value?.uploadHandle()
}

const fileListLength = ref(0)
const fileChange = (fileList) => {
  console.log(fileList)
  fileListLength.value = fileList.length
}
</script>

<template>
  <n-button v-bind="btnProps" @click="openPopup">{{ btnText }}</n-button>
  <popupMessage
    ref="popupRef"
    :title="t('system.upload')"
    width="31.25rem"
    @confirmHandle="confirmHandle"
    :comfirmDisable="fileListLength == 0"
  >
    <customUpload ref="uploadRef" :useButton="false" :fileChange="fileChange" />
  </popupMessage>
</template>

<style scoped></style>
